<template>
    <div>
        <el-dialog title="共享线索" width="500px" :visible.sync="dialogVisible">
            <template slot="title">
                共享线索<span style="font-size: 12px; color: #999; margin-left: 20px;">提示：保存成功后共享人将也能查看该线索</span>
            </template>
            <el-form ref="ruleForm" :model="form" :rules="rules" label-width="80px">
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="共享人" prop="members">
                            <el-select v-model="form.members" multiple placeholder="请选择人员" style="width: 100%;" @change="refreshData">
                                <el-option v-for="(item, index) in memberList" :key="index" :label="item.realname" :value="item.id" />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="handleSubmit">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
import { share } from '@/api/clue'
import { memberList } from '@/api/system'
export default {
    name: 'UserShareDialog',
    data() {
        return {
            dialogVisible: false,
            memberList: [],
            form: {
                members: []
            },
            rules: {
                members: [{ required: true, message: '请选择人员', trigger: 'change' }]
            }
        }
    },
    methods: {
        showDialog(list) {
            if (list.length) {
                let ids = list.map(item => {
                    return item.id
                })
                this.form.ids = ids.join(',');
                // this.resetParams();
                this.resetForm();
                this.getOptions();
                this.dialogVisible = true;
            }
        },
        resetForm() {
            this.$nextTick(() => {
                this.$refs.ruleForm.resetFields();
            })
        },
        resetParams() {
            this.form.members = [];
        },
        handleSubmit(e) {
            this.$refs.ruleForm.validate(valid => {
                if (valid) {
                    this.form.memberIds = this.form.members.join(',');
                    share(this.form).then(res => {
                        if (res.status == '1') {
                            this.$message.success('共享成功！')
                            this.$emit('success', res)
                        } else {
                            this.$message.error(res.message)
                        }
                    }).finally(() => {
                        this.dialogVisible = false
                    })
                }
            })
        },
        // 获取 options
        getOptions() {
            memberList().then(res => {
                this.memberList = res.data.list || []
            })
        },
        refreshData(val) {
            this.$forceUpdate()
        }

    }
}
</script>